<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>map，reduce方法的使用</title>
  </head>
  <body>
    <script>
      // map() 方法创建一个新数组，这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。
      let arr = ["hdcms", "houdunren"];
      let hd = arr.map(function (value, index, arr) {
        // console.log('值',value);
        // console.log('索引',index);
        // console.log('原数组',arr);
        return (value = `${value}-后盾人`);
      });
      // 一个新数组，每个元素都是回调函数的返回值。
      console.log(hd);
      console.log(arr);
      // 值类型会复制一份进行操作，不会改变原数组的

      let lesson = [
        { title: "媒体查询", category: "css" },
        { title: "flex弹性布局", category: "css" },
        { title: "Mysql", category: "js" },
      ];

      lesson.map(function (value) {
        // 复制的内存地址，value使用的是和原来一样的内存地址
        value.click = 100;
      });
      console.log(lesson); //  改变原数组

      let hdd = lesson.map(function (value) {
        return Object.assign({ num: 32 }, value); // 浅拷贝
      });
      console.log(hdd);

      let hddd = lesson.map(function (value) {
        return {
          title: value.title,
          category: value.category,
          id: value.id,
        };
      });
      console.log(hddd); // 也是不会改变原数组

      // reduce方法    统计数组中重复元素
      let deuplicateArr = [1, 2, 4, 2, 1, 1, 3, 2, 31, 1, 100];
      function arrayCount(array, item) {
        return array.reduce(function (total, cur) {
          total += item == cur ? 1 : 0;
          return total;
        }, 0); // 0 :统计的次数
      }
      console.log(arrayCount(deuplicateArr, 1));

      // 获取数组元素中最大值
      function maxArr(arr) {
        return arr.reduce(function (pre, cur) {
          return pre > cur ? pre : cur;
        });
      }
      console.log(maxArr(deuplicateArr));

      // 求购物车的最贵商品
      let goods = [
        { name: "iPhone14", price: 8000 },
        { name: "ipad", price: 4000 },
        { name: "imac", price: 25000 },
      ];
      // 封装一个寻找最贵商品的函数
      function expensiveGoods(arr) {
        return arr.reduce(function (pre, cur) {
          return pre.price > cur.price ? pre : cur;
        });
      }
      console.log(expensiveGoods(goods));

      // 封装一个所有商品求和的方法
      function sumGoods(arr) {
        return arr.reduce(function (total, cur) {
          return (total += cur["price"]);
        }, 0); // 有第二个参数total就是0了
      }
      console.log(sumGoods(goods));
    </script>
  </body>
</html>
